<template>
	<view style="position: relative;background: #202020;padding-top: 4vh;height: 100%;">
		<image @click="goUrl" src="/static/index/home.png" mode="scaleToFill" style="width: 64rpx;height: 64rpx;position: absolute;left: 50rpx;top: 100rpx;z-index: 105;"></image>
		<image src="/static/index/bg.jpg" mode="widthFix" style="width: 100vw;height: 100%;position: absolute;z-index: 1;"></image>
		<view class="box custom-font-text">
			<view  style="position: relative;height: 156rpx;padding: 0 30.56rpx;width: calc(100% - 61.12rpx);">
				<image style="position: absolute;left: 0;height: 100%;" src="/static/index/1.png" mode="heightFix"></image>
				<image style="position: absolute;right: 0;height: 100%;" src="/static/index/2.png" mode="heightFix"></image>
				<view class="" style="display: flex;align-items: flex-end;padding-top: 14rpx;">
					<text style="padding-right: 6rpx;color: #808080;font-size: 18rpx;">设备名称</text>
					<image style="width: 20rpx;height: 15rpx;margin-left: 6rpx;margin-bottom: 4rpx;" src="/static/index/4.png" mode="aspectFill"></image>
				</view>
				<view class="" style="display: flex;justify-content: space-between;align-items: center;padding: 8rpx 0 8rpx;position: relative;z-index: 101;">
					<text v-if="!isEditTitle"  style="font-size: 42rpx;color: #FFFFFF;">{{bt_msg.localName}}</text>
					<view v-else class="" style="background: #000000;color: #FFFFFF;height: 64rpx;font-size: 42rpx;display: flex;align-items: center;width: calc(100% - 104rpx);">
						<input type="text" v-model="ble_name" />
					</view>
					<image @click="editTitle" src="/static/index/3.png" style="width: 64rpx;height: 64rpx;" mode="scaleToFill"></image>
				</view>
				<view class="" style="display: flex;flex-direction: column;">
					<text style="font-size: 18rpx;color: #808080;padding-bottom: 6rpx;">设备ID：<text class="GemunuLibreLight">{{ bt_msg.deviceId }}</text></text>
					<text style="font-size: 18rpx;color: #808080;">信号强度RSSI: <text class="GemunuLibreLight">{{ bt_msg.RSSI }}</text></text>
				</view>
			</view>
			<view class="" style="display: flex;align-items: flex-end;margin-top: 102rpx;margin-left: 30.56rpx;">
				<text style="padding-right: 6rpx;color: #808080;font-size: 18rpx;">设备控制</text>
				<image style="width: 20rpx;height: 15rpx;margin-left: 6rpx;margin-bottom: 4rpx;" src="/static/index/4.png" mode="aspectFill"></image>
			</view>
			<view class="" style="width: 560rpx;height: 160rpx;margin-top: 20rpx;position: relative;">
				<image style="width: 100%;height: 100%;" src="/static/index/WechatIMG88.jpg" mode="aspectFill"></image>
				<image src="/static/index/5.png" style="width: 31rpx;height: 18rpx;position: absolute;right: 20rpx;top:15rpx" mode="scaleToFill"></image>
				<!-- <image src="/static/index/5.png" style="width: 30rpx;height: 15rpx;position: absolute;right: 20rpx;top:15rpx" mode="aspectFill"></image> -->
				<image @click="radio_mode_change('0')" :src="radio_mode==='0' ? '/static/index/6.png': '/static/index/7.png'" mode="aspectFit" style="position: absolute;width: 80rpx;height: 50rpx;left: 370rpx;bottom: 35rpx;"></image>
				<image @click="radio_mode_change('1')" :src="radio_mode==='1' ? '/static/index/6.png' : '/static/index/7.png'" mode="aspectFit" style="position: absolute;width: 80rpx;height: 50rpx;left: 95rpx;bottom: 35rpx;"></image>
			</view>
			 <view style="position: relative;z-index: 100;width: 560rpx;height: 181rpx;margin-top: 29rpx;"
			  v-for="(item,index) in radioItems" :key="item.value">
				<image style="width: 560rpx;height: 181rpx;position: absolute;" src="/static/index/8.png" mode="aspectFill"></image>
				<view class="" style="padding: 27rpx 29.86rpx 30.56rpx 30.56rpx;position: relative;z-index: 100;">
					<view v-if="radio_mode==='0'||!item.switch_checked" style="width: 560rpx;height: 181rpx;position: absolute;background-color: #333333;opacity: 0.7;z-index: 103;top: 0;left: 0;" ></view>
					<view class="" style="display: flex;justify-content: space-between;">
						<view class="" style="display: flex;align-items: flex-end;" @click="radioChange(item.current_mode,tem.checked===true?0:'')">
							<view class="" style="margin-right: 6rpx;display: flex;align-items: center;padding-bottom: 6rpx;">
								<image style="width: 24rpx;height: 24rpx;" v-if="item.checked"  src="/static/index/checked.png" mode="scaleToFill"></image>
								<image style="width: 24rpx;height: 24rpx;" v-else src="/static/index/noChecked.png" mode="scaleToFill"></image>
							</view>
							<view class="" style="display: flex;flex-direction: column;">
								<span class="GemunuLibreLight" style="font-size: 11rpx;color: #808080;padding-bottom: 4rpx;">{{item.title}}</span>
								<span style="color: #FFFFFF;">{{item.name}}</span>
							</view>
						</view>
						<view  @click="switchChange(!item.switch_checked,item.current_mode)"  class="GemunuLibreLight" :style="{'z-index': radio_mode==='0' ? 0 : 150}" style="position: relative;width: 103rpx;height: 34rpx;display: flex;align-items: center;margin-top: 4rpx;">
							<image src="/static/index/14.png" style="position: absolute;top: 0%;left: 0%;width: 103rpx;height: 33rpx;" mode="scaleToFill"></image>
							<image v-if="item.switch_checked" src="/static/index/13.png" style="position: absolute;width: 50rpx;height: 24rpx;right: 4rpx;transform: translate(0,-55%);top: 50%;" mode="aspectFill"></image>
							<image v-else src="/static/index/13.png" style="position: absolute;width: 50rpx;height: 24rpx;transform: translate(0,-55%);top: 50%;left: 6rpx;" mode="aspectFill"></image>
							<!-- <span @click="radioChange(item.current_mode,0)"  :style="{color: item.checked ? '#808080' : '#000000'}" style="font-size: 22rpx;position: relative;z-index: 100;width: 50%;text-align: center;">OFF</span>
							<span @click="radioChange(item.current_mode)"  :style="{color: !item.checked ? '#808080' : '#000000'}" style="font-size: 22rpx;position: relative;z-index: 100;width: 50%;text-align: center;">ON</span> -->
							<span :style="{color: !item.switch_checked ? '#808080' : '#000000'}" style="font-size: 22rpx;position: relative;z-index: 100;width: 50%;text-align: center;">OFF</span>
							<span :style="{color: item.switch_checked ? '#808080' : '#000000'}" style="font-size: 22rpx;position: relative;z-index: 100;width: 50%;text-align: center;">ON</span>
						</view>
					</view>
					<view class="" style="position: relative;z-index: 100;padding-top: 20rpx;display: flex;">
						<view class="GemunuLibreLight" style="font-weight: 400;color: #40BFFF;">
							<span style="font-size: 70rpx;">{{(item.slider_min === 1 ? 0 : item.slider_min) +  item.numberValue}}</span>
							<!-- <span style="font-size: 42rpx;">%</span> -->
						</view>
						<view class="" style="width: 462rpx;height: 43rpx;position: absolute;left: 70rpx;top: 20rpx;">
							<hbxw-slider  @changing="hbxwsliderchanging($event,item)" :value="item.numberValue" :max="(item.slider_max-(item.slider_min==1 ? 0 : item.slider_min))" :min="0">
							 <template #tag="{value}">
							  </template>
							  <template #handle>
								<image class="hbxw-slider-handle" style="height: 50rpx;width: 10rpx;margin-top: 0rpx;" src="/static/index/12.png" mode="aspectFill"></image>
							  </template>
							</hbxw-slider>
						</view>
					</view>
				</view>
			</view>
			<view class="" style="position: relative;margin-top: 70rpx;height: 218rpx;">
				<image src="/static/index/18.png" style="width: 560rpx;height: 218rpx;position: absolute;left: 0;top: 0;" mode="aspectFill"></image>
				<image src="/static/index/5.png" style="width: 31rpx;height: 18rpx;position: absolute;right: 27.78rpx;top:18.06rpx" mode="scaleToFill"></image>
				<view class="" style="width: 498rpx;height: 46rpx;position: relative;padding: 137.5rpx 31.94rpx 30rpx 29.86rpx;">
					<view class="" style="background: #000000;position: relative;width: 498rpx;height: 46rpx;">
						<input v-model="battery_life" placeholder="请输入续航时间(分钟)" @input="battery_life_input"
                           @change="battery_life_change" @blur="battery_life_blue" style="color: #FFFFFF;padding-left: 10rpx;font-size: 24rpx;" type="number"/>
						<view class="" style="position: absolute;left: 0%;bottom: 0;
						    width: 0;
						    height: 0;
						    border-left: 0 solid transparent;
						    border-right: 5px solid transparent;
						    border-bottom: 5px solid #2d2d2d; 
						">
						</view>
						<view class="" style="display: flex;align-items: center;justify-content: center;width: 75rpx;height: 46rpx;position: absolute;right: 0;top: 0;z-index: 101;" @click="battery_life_btn_click">
							<image src="/static/index/17.png" style="width: 100%;height: 100%;" mode="scaleToFill"></image>
							<span style="position: absolute;width: 75rpx;height: 46rpx;text-align: center;line-height: 46rpx;font-size: 24rpx;" >确认</span>
						</view>
					</view>
					<!-- <view class="" style="display: flex;justify-content: space-between;margin-top: 34.17rpx;padding-bottom: 4rpx;">
						<span style="color: #7c7c7c;font-size: 22rpx;">已续航</span>
						<span class="GemunuLibreLight" style="font-weight: 400;font-size: 22rpx;color: #FFFFFF;">{{cloneDeep_battery_life}}min</span>
					</view>
					<view class="" style="display: flex;align-items: center;position: relative;z-index: 100;justify-content: space-evenly;height:15rpx;">
						<view v-for="(item,index) in 12" :key="index">
							<image v-if="index>=10" style="height:15rpx;width: 35rpx;" src="/static/index/15.png" mode="aspectFill"></image>
							<image v-else style="height:15rpx;width: 35rpx;" src="/static/index/16.png" mode="aspectFill"></image>
						</view>
					</view> -->
				</view>
			</view>
			<view class="" style="width: 560rpx;height: 454rpx;position: relative;margin-top: 70rpx;">
				<image style="width: 560rpx;height: 454rpx;position: absolute;" src="/static/index/20.png" mode="aspectFit"></image>
				<image @click="radio_temperature_change(0)" style="width: 82rpx;height: 36rpx;position: absolute;top:113rpx;right:40rpx;" src="/static/index/22.png" mode="scaleToFill"></image>
				<image @click="radio_temperature_change(1)" style="width: 82rpx;height: 36rpx;position: absolute;top:218rpx;right:40rpx;" src="/static/index/22.png" mode="scaleToFill"></image>
				<image v-if="temperature_mode===2" style="width: 70rpx;height: 24rpx;position: absolute;top:224rpx;right:46rpx;" src="/static/index/21.png" mode="scaleToFill"></image>
				<image v-else-if="temperature_mode===1" style="width: 70rpx;height: 24rpx;position: absolute;top:119rpx;right:46rpx;" src="/static/index/21.png" mode="scaleToFill"></image>
				<view class="" style="background: #000000;position: absolute;width: 498rpx;height: 46rpx;bottom: 36.81rpx;left: 29.86rpx;">
					<input v-model="temperature" placeholder="范围42-60" @input="temperature_change"
                           @change="temperature_change" @blur="temperature_blue" style="color: #FFFFFF;padding-left: 10rpx;font-size: 24rpx;" type="number"/>
					<view class="" style="position: absolute;left: 0%;bottom: 0;
					    width: 0;
					    height: 0;
					    border-left: 0 solid transparent;
					    border-right: 5px solid transparent;
					    border-bottom: 5px solid #2d2d2d; 
					">
					</view>
					<view class="" style="display: flex;align-items: center;justify-content: center;width: 75rpx;height: 46rpx;position: absolute;right: 0;top: 0;z-index: 101;"  @click="temperature_btn_click">
						<image src="/static/index/17.png" style="width: 100%;height: 100%;" mode="scaleToFill"></image>
						<span style="position: absolute;width: 75rpx;height: 46rpx;text-align: center;line-height: 46rpx;font-size: 24rpx;">确认</span>
					</view>
				</view>
				<view class="" style="position: absolute;top: 80rpx;left: 34.17rpx;z-index: 100;">
					<view class="" style="position: relative;width:90px;height:96px;">
						<rounded  :imageList="imageList" style="position: absolute;transform: rotate(-90deg);"></rounded>
						<view class="" style="position: absolute;left: 55%;top: 52%;transform: translate(-50%,-50%);width: 72.4rpx;height: 88rpx;">
							<span style="font-size: 13rpx;color: #FFFFFF;padding-bottom: 4rpx;white-space: nowrap">当前温度：</span>
							<view class="GemunuLibreLight" style="display: flex;justify-content: flex-start;">
								<span style="font-size: 70rpx;color: #40BFFF;line-height: 56rpx;">{{current_temperature_lab}}</span>
								<span style="font-size: 24rpx;color: #7D7D7D;margin-top: -6rpx;">℃</span>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		
	</view>
 </template>

<script>
// import horizontalRule from '@/components/horizontal-rule/horizontal-rule.vue'
import rounded from '@/components/rounded/rounded.vue';
export default {
	components: {
		// 'horizontal-rule': horizontalRule,
		rounded,
	},
  data() {
    return {
	imageList:[],
	 height: 180,
	 timer:null,
	 styles: {
		line: '#dbdbdb',
		bginner: '#fbfbfb',
		bgoutside: '#ffffff',
		font: '#404040',
		fontColor: '#404040',
		fontSize: 16,
	 },
	 // 档位
	 radio_mode:0,
	 // 是否编辑标题
	 isEditTitle:false,
	 horizontaPointVal: '',
	 horizontaNoPointVal: '',
      radioItems: [{
        name: '微亮',
		title:'Micro-light',
        value: '51040101',
        // imgsrc: "qiangguang.png",
        checked: false,
        switch_checked: true,
        slider_min: 1,
        slider_max: 10,
		numberValue:1,
        slider_current_value: 1,
        current_mode: "1",
        radio_disable: false,
        slider_disable: false,
        switch_disable: false

      },
        {
          name: '低亮',
		  title:'Low brightness',
          value: '51040102',
          // imgsrc: "gongzuo.png",
          checked: false,
          switch_checked: true,
          slider_min: 10,
          slider_max: 30,
		  numberValue:10,
          slider_current_value: 20,
          current_mode: "2",
          radio_disable: false,
          slider_disable: false,
          switch_disable: false
        },
        {
          name: '中亮',
		  title:'Medium brightness',
          value: '51040103',
          // imgsrc: "baoshan.png",
          checked: false,
          switch_checked: true,
          slider_min: 30,
          slider_max: 50,
		  numberValue:10,
          slider_current_value: 40,
          current_mode: "3",
          radio_disable: false,
          slider_disable: false,
          switch_disable: false
        },
        {
          name: '高亮',
		  title:'High brightness',
          value: '51040104',
          // imgsrc: "baoshan.png",
          checked: false,
          switch_checked: true,
          slider_min: 60,
          slider_max: 100,
		  numberValue:10,
          slider_current_value: 10,
          current_mode: "4",
          radio_disable: false,
          slider_disable: false,
          switch_disable: false
        },
        {
          name: '爆闪',
		  title:'Strobe',
          value: '51040105',
          // imgsrc: "baoshan.png",
          checked: false,
          switch_checked: true,
          slider_min: 50,
          slider_max: 80,
		  numberValue:0,
          slider_current_value: 50,
          current_mode: "5",
          radio_disable: false,
          slider_disable: false,
          switch_disable: false
        },
        {
          name: 'SOS',
		  title:'紧急呼救信号',
          value: '51040106',
          // imgsrc: "baoshan.png",
          checked: false,
          switch_checked: true,
          slider_min: 1,
          slider_max: 20,
		  numberValue:1,
          slider_current_value: 1,
          current_mode: "6",
          // 状态
          radio_disable: false,
          slider_disable: false,
          switch_disable: false
        },
        // {
        // 	name: '关机',
        // 	value: '5A040100',
        // }
      ],
      // 档位/无级的单选按钮值
      mode_mode: "0",
      Infinite_mode: "1",
      // 档位/无级是否选中
      dangwei: false,
      wuji: false,
      // 温控/温控曲线单选按钮的值
      temperature_control: "0",
      temperature_curve: "1",
      // 温控/温控曲线单选按钮的值
      temperature_mode: -1,
      temp: false,
      temp_cure: false,
      // 续航时间输入框
      battery_life: "",
	  cloneDeep_battery_life: "",
      // 温度保护输入框
      temperature: "",
      // 当前温度显示
      current_temperature_lab: -1,
      // 全部信息
      choice_ble_all: {},
      // 展示信息
      bt_msg: {},
      // service 信息
      choice_ble_service: {},
      // 是否设置关机
      isoff: false,
      // showoffblepng: false,
      imgsrc: "/static/ok.png",
      // 输入框提示样式
      placeholderStyle: "font-size:14px",
      interval_update_id: null,
      // 是不是第一次查询，第一次的时候才更新所有
      is_first_update: true,
      // 蓝牙名字
      ble_name: '',
      // 重连
      retryCount: 0,
      maxRetries: 10,
      retryInterval: 5000, // 5 s
      reconnectTimer: null,
      connected: false,
      deviceId: "",
      serviceId: "",
      characteristicId_write: "",
      characteristicId_notify: "",
      isNotifyEnabled: false
    }
  },

  onReady() {

    // let res =this.hexToDecimal("01190100010A04325537193F")


    // this.ctx = uni.createCanvasContext('myCanvas', this)
    // this.ctx.width = 64
    // this.ctx.height = 128
    // // ctx.setFontSize(16)
    // this.ctx.fillStyle = '#000000'
    // this.ctx.font = '16px SimSun'

  },
  onLoad: function (option) {
	  setTimeout(()=>{
		  this.addTemperature()
	  },1000)
    console.log(this.isOnHomePage())
    console.log("onload")
    console.log(option.item); //打印出上个页面传递的参数。
    if (undefined == option.item) {
      console.log("初始化数据空的不执行");
      return
    }
    let item = JSON.parse(option.item)
    this.choice_ble_all = item
    this.bt_msg = item.info
    this.choice_ble_service = item.service
    console.log(this.bt_msg)
    console.log(this.choice_ble_service);
    // 启动监听
    this.notifyBLECharacteristicValueChange(this.choice_ble_service.deviceId, this.choice_ble_service
        .serviceId, this.choice_ble_service.characteristicId_notify)
    // 发送指令查询各个模式下的值
    this.send("51040701")
    this.interval_update_id = setInterval(this.interval_update, 10000)
  },
  onUnload() {
    // 页面卸载时，确保定时器被清除
    this.stopReconnectTask();
    console.log("onUnload")
    let that = this
    // 执行清理或保存数据的逻辑
    uni.closeBLEConnection({
      deviceId: that.bt_msg.deviceId,
      success(res) {
        console.log("关闭蓝牙" + res)
        uni.closeBluetoothAdapter({
          success(res) {
            console.log("关闭蓝牙适配器" +
                res)
          }
        })
      }
    })

    uni.closeBluetoothAdapter({
      success(res) {
        console.log(res)
        console.log("关闭蓝牙适配器")
      }
    })
    clearInterval(this.interval_update_id)
    console.log("清理定时任务")
  },
  // 页面隐藏/切换到后台时触发
  onHide() {
    // 执行相关逻辑
    console.log("onHide")
  },
  methods: {
	  goUrl(){
		uni.navigateTo({
			url:'/pages/connect/connect'
		})  
	  },
	  editTitle(){
		  if(this.isEditTitle){
			  this.ble_name_btn_click()
		  }
		this.isEditTitle = !this.isEditTitle
	  },
	  addTemperature(){
		  if(this.current_temperature_lab>0){
			  for (let i = 0; i < Math.round(this.current_temperature_lab/100*36); i++) {
			  	this.imageList.push('/static/rounded/1.png')
			  }
			  for (let i = 0; i < 36-Math.round(this.current_temperature_lab/100*36); i++) {
			  	this.imageList.push('/static/rounded/2.png')
			  }
		  }else{
			   for (let i = 0; i < 36; i++) {
			  		this.imageList.push('/static/rounded/2.png')
			   }
		  }
	  },
	hbxwsliderchanging($event,val) {
		console.log($event,val)
		// const node = this.radioItems.find(item => item.value === val.value)
		// node.slider_current_value = $event
		clearTimeout(this.timer); // 清除之前的定时器
		this.timer = setTimeout(() => {
			this.sliderChange($event+val.slider_min,val.current_mode);
		}, 300); 
	},
    // 单选切换
    radioChange: function (e,value) {
      var checked = value===0 ? null : e
      console.log(checked)
      // 当前模式命令
      var send_hex_str;
      // 当前亮度值
      var current_light_value;
      // 当前模式数字
      var current_mode;
      for (let i = 0; i < this.radioItems.length; i++) {
        if (this.radioItems[i].current_mode === checked) {
          console.log("选中" + this.radioItems[i].name + '亮度是' + this.radioItems[i].slider_current_value);
          this.radioItems[i].checked = true
          send_hex_str = this.radioItems[i].value
          current_light_value = this.radioItems[i].slider_current_value
		  this.radioItems[i].numberValue = this.radioItems[i].slider_current_value - this.radioItems[i].slider_min
          current_mode = this.radioItems[i].current_mode
          // 发送模式
          this.send(send_hex_str)
          this.radioItems[i].slider_disable = false
        } else {
          this.radioItems[i].checked = false
          this.radioItems[i].slider_disable = true
        }
      }
      // let hexnum = current_light_value.toString(16).toUpperCase()
      // let hex_command = "5105020" + current_mode + hexnum
      // 发送模式对应亮度
      // this.send(hex_command)
    },
    // 滑块切换
    sliderChange(e, current_mode) {
      console.log('value 发生变化：' + e + "mdoe模式" + current_mode)
      for (let i = 0; i < this.radioItems.length; i++) {
        if (this.radioItems[i].current_mode === current_mode) {
          console.log("选中" + this.radioItems[i].name + '亮度是' + this.radioItems[i].slider_current_value);
          this.radioItems[i].slider_current_value = e
			this.radioItems[i].numberValue = this.radioItems[i].slider_current_value - this.radioItems[i].slider_min
        }
      }
      for (let i = 0; i < this.radioItems.length; i++) {
        if (this.radioItems[parseInt(current_mode) - 1].checked === true) {
          let hexnum = e.toString(16).toUpperCase()
          let hex_command = "5105020" + current_mode + hexnum
          console.log(hex_command)
          this.send(hex_command)
          break
        }
      }

      // this.slidervalue = e.detail.value
      // this.saveSliderValue(e.detail.value)
    },
    // 滑块切换中
    sliderChanging(e, current_mode) {
      console.log('value 发生变化ing：' + e.detail.value + 'mdoe模式' + current_mode)
      for (let i = 0; i < this.radioItems.length; i++) {
        if (this.radioItems[i].current_mode === current_mode) {
          console.log("选中" + this.radioItems[i].name + '亮度是' + this.radioItems[i].slider_current_value);
          this.radioItems[i].slider_current_value = e.detail.value
        }
      }
    },
    // 开关切换
    switchChange(e, current_mode) {
      // console.log(e.detail.value + 'mode' + current_mode)
      if (e === false) {
        this.radioItems[Number(current_mode) - 1].radio_disable = true
        this.radioItems[Number(current_mode) - 1].slider_disable = true
        this.radioItems[Number(current_mode) - 1].switch_checked = false
      } else {
        this.radioItems[Number(current_mode) - 1].radio_disable = false
        this.radioItems[Number(current_mode) - 1].slider_disable = false
        this.radioItems[Number(current_mode) - 1].switch_checked = true
      }
      console.log("switch 却换" + this.radioItems[Number(current_mode) - 1].switch_checked)
      let hidemode_str = "";
      for (let i = 0; i < this.radioItems.length; i++) {
        console.log(this.radioItems[i].switch_checked)
        if (this.radioItems[i].switch_checked === true) {
          hidemode_str = hidemode_str + "1"
        } else {
          hidemode_str = hidemode_str + "0"
        }
      }
      // console.log(hidemode_str.split('').reverse().join(''))
      this.send("510406" + this.binstr2hex("00" + hidemode_str.split('').reverse().join('')))

    },
    // 档位和无级切换
    radio_mode_change: function (e) {
      var mode = e
	  this.radio_mode = e
      console.log("当前模式是（档位0/无级1）：" + mode + typeof (mode))
      let that = this
      let hex_str = "510404"
      if (mode === "1") {
        // 档位启动
        console.log("进入0");
        for (let i = 0; i < that.radioItems.length; i++) {
          console.log("进入0，并不禁用");
          that.radioItems[i].radio_disable = false
          that.radioItems[i].slider_disable = false
          that.radioItems[i].switch_disable = false
        }
        hex_str = hex_str + "01"
      } else if (mode === "0") {
        // 禁用
        console.log("进入1");
        for (let i = 0; i < that.radioItems.length; i++) {
          console.log("进入1，并禁用");
          that.radioItems[i].radio_disable = true
          that.radioItems[i].slider_disable = true
          that.radioItems[i].switch_disable = true
        }
        hex_str = hex_str + "02"
      }
      for (let i = 0; i < that.radioItems.length; i++) {
        console.log("modeddd" + that.radioItems[i].switch_checked)
        if (that.radioItems[i].switch_checked === false) {
          // 切换模式,如果是某个开关是禁用的,就给单选和滑块禁用
          that.radioItems[i].radio_disable = true
          that.radioItems[i].slider_disable = true
        }
        // else{
        // 	that.radioItems[i].radio_disable=false
        // 	that.radioItems[i].slider_disable=false
        // }
      }
      console.log(hex_str)
      that.send(hex_str)
      // 无级切换档位，查询一下,强制设置微亮开
      if (mode === "1") {
        this.send("51040701")
		that.radioItems.forEach(item => {
			item.checked = false
		})
		that.radioItems[0].switch_checked = true
		that.radioItems[0].checked = true
		that.radioItems[0].slider_disable = false
      }
    },
    // 温度温控切换
    radio_temperature_change(e) {
      // console.log(parseInt(e));
      if (parseInt(e) === 0) {
        this.temperature_mode = 1
		// this.$set('temperature_mode',1)
      } else if (parseInt(e) === 1) {
        this.temperature_mode = 2
		// this.$set('temperature_mode',2)
      }
      console.log(this.temperature_mode)
    },
    // 定时续航按钮点击
    battery_life_btn_click() {
		console.log('221321')
      this.battery_life_change(this.battery_life)
	  this.cloneDeep_battery_life = this.battery_life
      if (this.battery_life === "") {
        return
      }
      // let hexnum = this.number2HexString(this.battery_life,2)
      let hexnum = this.battery_life.toString(16).toUpperCase();
      if (hexnum.length < 4) {
        while (hexnum.length < 4) {
          hexnum = "0" + hexnum;
        }
      }
      console.log(this.battery_life, hexnum)

      let hex_command = "510503" + hexnum
      this.send(hex_command)
    },
    // 温度保护按钮点击
    temperature_btn_click() {
      console.log(this.temperature);
      if (this.temperature === "") {
        return
      }
      if (this.temperature_mode === -1) {
        console.log('未选择温控模式')
        return;
      }
      let hexnum = this.number2HexString(this.temperature, 2)
      console.log(this.temperature, hexnum)

      let hex_command = "510505";
      if (this.temperature_mode === 1) {
        hex_command = hex_command + "01" + hexnum
      } else if (this.temperature_mode === 2) {
        hex_command = hex_command + "02" + hexnum
      }
	  this.addTemperature()
      this.send(hex_command)
    },
    // 定时续航输入框事件
    battery_life_input(e) {
      console.log(e);
    },
    // 定时续航输入框事件
    battery_life_change(e) {
      let value = parseFloat(e);
      if (value > 1440) {
        value = 1440;
      } else if (value < 180) {
        value = 180;
      }
      this.battery_life = value
    },
    battery_life_blue(e) {
      // console.log(this.battery_life)
      this.battery_life_change(e.detail.value)
      // console.log(this.battery_life)
    },
	temperature_blue(e){
		this.temperature_change(e.detail.value)
	},
    // 温度保护输入框事件
    temperature_input(e) {
      console.log(e);
	  // this.temperature = e.target.value
    },
    // 温度保护输入框事件
    temperature_change(e) {
      let value = parseFloat(e);
      if (value > 60) {
        value = 60;
      } else if (value < 42) {
        value = 42;
      }
      this.temperature = value
	  console.log(this.temperature)
    },
    modifySliderValue(hexStr, is_first_update) {
      console.log('进入查询处理')
      // 处理滑块值
      // let that = this
      let res = []
      // 连接时，处理滑块值
      // if (hexStr.length === 17 * 2) {
      res = this.hexToDecimal(hexStr)
      // }
      // if (res.length === 17) {
      console.log(res)
      if (!is_first_update) {
        // 如果不是第一次进来就只更新温度
        let tempt = res[1]
        if (tempt > 0x7F) {
          tempt -= 0x100;
        }
        this.current_temperature_lab = tempt
		this.addTemperature()
        return
      }
      // 当前系统模式
      if (res[0] === 1) {
		  this.radio_mode = '1'
        // this.dangwei = true
        // this.wuji = false
      } else {
		  this.radio_mode = '0'
        // this.wuji = true
        // this.dangwei = false
      }
      // // 设备温度2
      let tempt = res[1]
      if (tempt > 0x7F) {
        tempt -= 0x100;
      }
      this.current_temperature_lab = tempt
      // // 温控模式3
      if (res[2] === 1) {
        this.temp = true
        this.temp_cure = false
        this.temperature_mode = 1
      } else {
        this.temp_cure = true
        this.temp = false
        this.temperature_mode = 2
      }
      // // 温控保护温度4
      this.temperature = res[3]
      // 当前档位 5
      if (res[0] === 1) {
        // 档位
        console.log("查询为档位，处理档位选中和滑块值" + res[4])
        switch (res[4]) {
          case 0:
            // 关机
            break;
          case 1:
            // 微亮
            this.radioItems[0].checked = true
            // this.radioItems[0].slider_current_value = res[5]
            break;
          case 2:
            // 低亮
            this.radioItems[1].checked = true
            // this.radioItems[1].slider_current_value = res[6]
            break;
          case 3:
            // 中亮
            this.radioItems[2].checked = true
            // this.radioItems[2].slider_current_value = res[7]
            break;
          case 4:
            // 高亮
            this.radioItems[3].checked = true
            // this.radioItems[3].slider_current_value = res[8]
            break;
          case 5:
            // 爆闪
            this.radioItems[4].checked = true
            // this.radioItems[4].slider_current_value = res[9]
            break;
          case 6:
            // sos
            this.radioItems[5].checked = true
            // this.radioItems[5].slider_current_value = res[10]
            break;
          case 7:
            // 定时档位
            break;
          default:
            break;
        }
        for (let i = 0; i < this.radioItems.length; i++) {
          if (res[4] - 1 !== i) {
            this.radioItems[i].slider_disable = true
          }
        }

      } else {
        // 无级模式
        console.log("查询为无级，处理档位选中和滑块值" + res[4])

        // switch (res[4]) {
        // 	case 0:
        // 		// 关机
        // 		break;
        // 	case 1:
        // 		// 开机
        // 		break;
        // 	case 5:
        // 		// 爆闪
        // 		this.radioItems[4].checked = true
        // 		// this.radioItems[4].slider_current_value = res[9]
        // 		break;
        // 	case 6:
        // 		// sos
        // 		this.radioItems[5].checked = true
        // 		// this.radioItems[5].slider_current_value = res[10]
        // 		break
        // 	case 7:
        // 		// 定时挡位模式
        // 		break
        // 	default:
        // 		break
        // }
        // 查询是无级模式禁用所有的按钮操作
        for (let i = 0; i < this.radioItems.length; i++) {
          this.radioItems[i].radio_disable = true
          this.radioItems[i].slider_disable = true
          this.radioItems[i].switch_disable = true

        }

      }
      // 设置滑块值
      this.radioItems[0].slider_current_value = res[5]
      this.radioItems[1].slider_current_value = res[6]
      this.radioItems[2].slider_current_value = res[7]
      this.radioItems[3].slider_current_value = res[8]
      this.radioItems[4].slider_current_value = res[9]
      this.radioItems[5].slider_current_value = res[10]
	  for (let i = 0; i <= 5; i++) {
		  console.log(i,'iiiii')
		 this.radioItems[i].numberValue = res[i+5] - this.radioItems[i].slider_min 
	  }
      let hide_mode = res[11]
      // 63-->3f-->[00111111]
      let hide_mode_str = hide_mode.toString(2).split('').reverse().join('')
      console.log(hide_mode_str)
      for (let i = 0; i < hide_mode_str.length; i++) {
        console.log(hide_mode_str.charAt(i))
        if (hide_mode_str.charAt(i) === "1") {
          this.radioItems[i].switch_checked = true
        } else {
          this.radioItems[i].switch_checked = false
        }
      }
      // 查询定时续航时间
      let high_time = res[12].toString(16).toUpperCase()
      let low_time = res[13].toString(16).toUpperCase()
      console.log(low_time, high_time)

      // let timestr = parseInt(low_time, 16)+parseInt(high_time, 16);
      let timestr = low_time + high_time
      console.log("16进制" + timestr)
      let dec_time = parseInt(timestr, 16)
      console.log("十进制" + dec_time)
      this.battery_life = dec_time

      // }
    },
    // 发送数据
    send(hexstr) {
      console.log('send' + hexstr)
      let buffer = this.hexStringToArrayBuffer(hexstr)
      // console.log("buffer is :" + buffer)
      let that = this
      setTimeout(() => {
        uni.writeBLECharacteristicValue({
          deviceId: that.choice_ble_service.deviceId,
          serviceId: that.choice_ble_service.serviceId,
          characteristicId: that.choice_ble_service.characteristicId_write,
          value: buffer,
          success(res) {
            console.log('发送success', res.errMsg)
            // uni.showToast({
            // 	title: 'write指令发送成功'
            // })
          },
          fail(err) {
            console.error(err)
            if (hexstr != '51040701') {
              // 定时任务的不弹失败
              uni.showToast({
                title: '操作失败,请检查连接!',
                icon: 'error'
              })
            }

            // that.setscreenok = false
            // console.log("设置screen false");
          }
        })
      }, 50);

    },
    // 将十六进制字符串转换为 ArrayBuffer 对象
    hexStringToArrayBuffer(hexString) {
      let bytes = hexString.match(/.{1,2}/g).map(byte => parseInt(byte, 16));
      return new Uint8Array(bytes).buffer;
    },
    // buffer转换为16进制字符串
    arrayBufferToHexString(buffer) {
      let hexString = Array.from(new Uint8Array(buffer)).map(byte => ("00" + byte.toString(16)).slice(-
          2)).join(
          "");
      return hexString.toUpperCase();
    },
    number2HexString(num, l = 4) {
      let hexString = num.toString(16).toUpperCase(); // 转换为16进制并转大写
      return hexString.padStart(l, '0'); // 不足长度时前补0
    },
    // 启用 notify 功能
    notifyBLECharacteristicValueChange(deviceId, serviceId, characteristicId) {
      console.log("进入notify代码")
      let that = this
      if (that.isNotifyEnabled) {
        console.log("notify已经开启")
        return
      }
      uni.notifyBLECharacteristicValueChange({
        state: true, // 启用 notify 功能
        deviceId: deviceId,
        serviceId: serviceId,
        characteristicId: characteristicId,
        success: (res) => {
          console.log("notify 监听开始")
          that.isNotifyEnabled = true
          //监听设备发送数据
          uni.onBLECharacteristicValueChange((res) => {
            // console.log("监听成功", res.value)
            uni.onBLEConnectionStateChange(function (res) {
              // 该方法回调中可以用于处理连接意外断开等异常情况
              console.log(
                  `device ${res.deviceId} state has changed, connected: ${res.connected}`
              )
              that.connected = res.connected
              if (!res.connected) {
                uni.showToast({
                  icon: 'none',
                  title: '设备已断开连接',
                  duration: 2000
                })
                if (!that.isOnHomePage()) {
                  console.log('非首页，开始尝试重连');
                  that.startReconnectTask(deviceId);
                } else {
                  console.log('当前处于首页，不进行重连');
                }
              } else {
                console.log('蓝牙已经连接成功');
                that.connected = true;
                that.stopReconnectTask();
              }
            })
            let str = that.arrayBufferToHexString(res.value)
            //转换后的数据
            console.log("数据变化" + str)
            if (str.startsWith("51040801")) {
              uni.showToast({
                icon: 'none',
                title: '修改名称成功',
                duration: 1500
              })


              setTimeout(() => {
                uni.closeBLEConnection({
                  deviceId: that.bt_msg.deviceId,
                  success(res) {
                    console.log("关闭蓝牙" + res)
                    uni.closeBluetoothAdapter({
                      success(res) {
                        console.log("关闭蓝牙适配器" +
                            res)
                      }
                    })
                  }
                })

                uni.closeBluetoothAdapter({
                  success(res) {
                    console.log(res)
                    console.log("关闭蓝牙适配器")
                  }
                })
                clearInterval(that.interval_update_id)

                console.log("清理定时任务")
                that.stopReconnectTask()
                uni.redirectTo({
                  url: '/pages/connect/connect'
                });
              }, 1500);

            }
            if (str.startsWith("51040800")) {
              uni.showToast({
                icon: 'none',
                title: '修改名称失败',
                duration: 1500
              })
            }
            // 连接时获取手电当前的值
            if (str.startsWith('510E07')) {
              that.modifySliderValue(str.replace('510E07', ''), that.is_first_update)
              that.is_first_update = false
            }
          })
        },
        fail: (res) => {
          console.log('启用 notify 功能失败', res)
          uni.showToast({
            icon: 'none',
            title: '设备暂不支持接收数据',
            duration: 3000
          })
        }
      })
    },
    hexToDecimal(hexStr) {

      // 示例使用
      //  "64233201";// 输出：[100, 35, 50, 1]
      let decimalValues = [];
      for (let i = 0; i < hexStr.length; i += 2) {
        // 每次取两个字符
        const hexPair = hexStr.substr(i, 2);
        // 将这个16进制对转换为十进制数
        const decimalValue = parseInt(hexPair, 16);
        decimalValues.push(decimalValue);
      }

      return decimalValues;
    },
    binstr2hex(binstr) {
      // 将二进制字符串转换为十进制
      let decimalValue = parseInt(binstr, 2);

      // 将十进制转换为16进制字符串
      let hexString = decimalValue.toString(16).toUpperCase();
      return hexString;
    },
    binaryToHex(binaryArray) {
      const hexArray = [];

      for (let i = 0; i < binaryArray.length; i += 8) {
        const binaryChunk = binaryArray.slice(i, i + 8)
        const hexValue = binaryChunk.reduce((acc, bit) => acc * 2 + bit, 0).toString(16);
        hexArray.push(hexValue.padStart(2, '0').toUpperCase());
      }
      // console.log("hexArray" + hexArray);
      return hexArray;
    },
    sortarr(binaryArray) {
      const sortarr = [];
      // 使用for循环按照指定顺序取出数字

      for (let i = 0; i < 128 / 8; i++) {
        // 多少行

        for (let j = 0; j < 64; j++) {
          // 下高位
          for (var n = 7; n >= 0; n--) {
            // console.log(n);
            sortarr.push(binaryArray[n + (i * 8)][j])
          }

        }

      }
      // console.log("sortArr" + sortarr, sortarr.length);
      return sortarr
    },
    interval_update() {
      // 发送指令查询各个模式下的值
      console.log('执行定时任务了')
      this.send("51040701")
    },
    ble_name_input(e) {
      console.log('input' + e)
      // 创建一个新的字符串，只包含ASCII范围内的字符
      // 更新输入框的值
      // this.ble_name = e.replace(/[^\x00-\x7F]/g, '')
      this.$nextTick(() => {
        this.ble_name = e.split('').map(char => {
          const charCode = char.charCodeAt(0);
          return (charCode >= 0 && charCode <= 127) ? char : '';
        }).join('')
      })

    },
    ble_name_change_blur(e) {
      this.ble_name_input(e.detail.value)
    },
    ble_name_change(e) {
      console.log('change' + this.ble_name)
      this.ble_name_input(e)
    },
    ble_name_btn_click() {
      if (this.ble_name.length === 0) {
        console.log("空的不设置")
        return
      }
      let tmp_name = this.ble_name;
      if (this.ble_name.length < 8) {
        for (let i = 0; i < 8 - this.ble_name.length; i++) {
          tmp_name += " "
        }
      }
      // console.log(this.ble_name)
      console.log(this.stringToHex(tmp_name))
      let ble_name_hex = this.stringToHex(tmp_name)
      this.send("510B08" + ble_name_hex)
    },

    stringToHex(str) {
      let hex = '';
      for (let i = 0; i < str.length; i++) {
        // 获取每个字符的Unicode码点
        let charCode = str.charCodeAt(i);
        // 将码点转换为十六进制字符串
        let charHex = charCode.toString(16);
        hex += charHex;
      }
      return hex;
    },
    // 开始重连任务
    startReconnectTask(deviceId) {
      if (this.reconnectTimer) {
        clearInterval(this.reconnectTimer);
      }

      this.retryCount = 0;
      this.reconnectTimer = setInterval(() => {
        if (this.retryCount < this.maxRetries && !this.connected) {
          console.log(`第 ${this.retryCount + 1} 次尝试重连...`);
          this.retryCount++;
          this.connectBluetoothDevice();
        } else if (this.retryCount >= this.maxRetries) {
          console.log('重试次数已达上限，返回主界面');
          clearInterval(this.reconnectTimer);
          this.goToHomePage();
        }
      }, this.retryInterval);
    },

    // 停止重连任务
    stopReconnectTask() {
      let that = this
      if (this.reconnectTimer) {
        clearInterval(this.reconnectTimer);
        this.reconnectTimer = null;
      }
    },
    // 蓝牙设备连接逻辑
    connectBluetoothDevice() {
      let that = this

      uni.closeBLEConnection({
        deviceId: that.bt_msg.deviceId,
        success(res) {
          console.log("关闭蓝牙" + res)
          uni.closeBluetoothAdapter({
            success(res) {
              console.log("关闭蓝牙适配器" +
                  res)
            }
          })
        }
      })
      uni.openBluetoothAdapter({
        success: (res) => { //已打开
          uni.getBluetoothAdapterState({ //蓝牙的匹配状态
            success: (row) => {
              console.log(row)
              // 开始搜索蓝牙设备
              setTimeout(() => {
                uni.createBLEConnection({
                  deviceId: that.bt_msg.deviceId,
                  timeout: 2000,
                  success: () => {
                    console.log('蓝牙连接成功');
                    that.isNotifyEnabled = false;
                    // this.connected = true;
                    this.stopReconnectTask();
                    // 设置最大传输字节  这里根据情况自己设置
                    uni.setBLEMTU({
                      deviceId: that.bt_msg.deviceId,
                      mtu: 240, //传输字节数
                      success() {
                        console.log("设置成功")
                      },
                      fail() {
                        // console.log("设置mtu失败");
                      },
                      complete() {
                        console.log("complate")
                      }
                    })
                    //获取服务
                    setTimeout(() => {
                      //获取服务
                      that.getBLEDeviceServices()
                    }, 1000)
                  },
                  fail: (err) => {
                    console.log('蓝牙连接失败', err);
                  }
                });

              }, 300)
            },
            fail(error) {
              uni.showToast({
                icon: 'none',
                title: '查看手机蓝牙是否打开'
              });
            }
          });
        },
        fail: err => { //未打开
          uni.showToast({
            icon: 'none',
            title: '查看手机蓝牙是否打开'
          });
        }
      })

    },
    // 返回主界面
    goToHomePage() {
      this.stopReconnectTask();
      let that = this
      // 执行清理或保存数据的逻辑
      uni.closeBLEConnection({
        deviceId: that.bt_msg.deviceId,
        success(res) {
          console.log("关闭蓝牙" + res)
          uni.closeBluetoothAdapter({
            success(res) {
              console.log("关闭蓝牙适配器" +
                  res)
            }
          })
        }
      })

      uni.closeBluetoothAdapter({
        success(res) {
          console.log(res)
          console.log("关闭蓝牙适配器")
        }
      })
      clearInterval(this.interval_update_id)
      console.log("清理定时任务")
      that.isNotifyEnabled = false
      uni.redirectTo({
        url: '/pages/connect/connect' // 跳转到主界面
      });
    },

    // 手动返回并停止任务
    manualStopReconnect() {
      this.stopReconnectTask();
      this.goToHomePage();
    },
    // 判断当前页面是否为首页
    isOnHomePage() {
      const pages = getCurrentPages(); // 获取当前页面栈
      if (pages.length > 0) {
        const currentPage = pages[pages.length - 1]; // 获取栈中的最后一个页面，即当前页面
        console.log('当前页面路径:', currentPage.route);

        // 判断当前页面路径是否是首页路径（根据你项目的实际首页路径替换）
        return currentPage.route === 'pages/connect/connect';
      }
      return false;
    },
    getBLEDeviceServices() {
      let that = this
      uni.getBLEDeviceServices({
        deviceId: that.bt_msg.deviceId,
        success: (res) => {
          console.log("获取服务成功", res)
          //这里会获取到好多个services  uuid  根据实际情况选择自己需要的服务
          // console.log("services", res.services)
          if (res.services.length > 0) {
            console.log("services:" + res.services)
            try {
              for (var i = 0; i < res.services.length; i++) {
                console.log(res.services[i])
              }
              // let serviceId = res.services[1].uuid //根据我们的设备  使用的是第三个服务
              // that.serviceId = res.services[1].uuid
              // //获取服务特征
              that.getBLEDeviceCharacteristics()
            } catch (error) {
              console.log(error)
              uni.showToast({
                icon: 'none',
                title: '蓝牙连接服务失败'
              })

            }

          } else {
            console.log('未获取到蓝牙服务')
          }
        },
        fail(res) {
          console.log("获取蓝牙服务失败", res)
          uni.hideLoading();
          uni.showToast({
            icon: 'none',
            title: '蓝牙连接服务失败'
          })
        },
        complete() {
          console.log('获取服务完成')
        }
      })
    },
	getBLEDeviceCharacteristics() {
      console.log("------------------进入特征------------------");
      let that = this
      uni.getBLEDeviceCharacteristics({
        deviceId: that.choice_ble_service.deviceId,
        serviceId: that.choice_ble_service.serviceId,
        success: (res) => {
          console.log("res.characteristics.", res.characteristics)
          // that.characteristics = res.characteristics
          // 这里哪个特征支持notify或indicate  就选择哪个
          try {

            that.characteristicId_write = res.characteristics[0].uuid // 写数据的特征uuid
            that.characteristicId_notify = res.characteristics[3].uuid //通知
          } catch (error) {
            console.log(error)
            // uni.hideLoading();
            uni.showToast({
              icon: 'none',
              title: '获取蓝牙信息失败'
            })
            // that.isconnecting = false
            return
          }
          let service_info = {}
          service_info.deviceId = that.deviceId
          service_info.serviceId = that.serviceId
          service_info.characteristicId_write = that.characteristicId_write
          service_info.characteristicId_notify = that.characteristicId_notify

          // that.choice_ble_service = service_info

          // 连接成功之后  把已连接的设备从设备列表中删除
          // 跳转主页
          that.connected = true;

          that.notifyBLECharacteristicValueChange(that.choice_ble_service.deviceId, that.choice_ble_service.serviceId, that.choice_ble_service.characteristicId_notify)
           uni.showToast({
                  icon: 'none',
                  title: '设备已重新连接',
                  duration: 2000
                })
        },
        fail: (res) => {
          console.log(res)
          uni.showToast({
            icon: 'none',
            title: '蓝牙信息失败'
          })
        }
      })
    }
  }
}
</script>

<style>
.box{
	padding-top: 11vh;
	margin: 0 95rpx 0;
	position: relative;
	z-index: 1000;
}
.container {
  padding: 5px;
  font-size: 14px;
  line-height: 24px;
}

.input_name {
  color: '#2979FF';
  borderColor: '#2979FF';
}

.list-item {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: 10px 0 10px 0;
  box-sizing: border-box;
  border: 1px solid #000;
  border-style: none none solid none;
  border-bottom-color: lightgray;
}

.list-item:last-child {
  border-style: none;
}

.text-area {
  width: 64px;
  /* 设置文本域的宽度 */
  height: 128px;
  /* 设置文本域的高度 */
  white-space: normal;
  /* 正常换行 */
  word-wrap: break-word;
  /* 单词内换行 */
  overflow-wrap: break-word;
  /* 超出视窗宽度时换行 */
}

.rdo-controll {
  /* border: 1px solid red; */

}

.div1 {
  /* width:100%;        */
  height: 100%;
  border: 1px solid red;
  margin-left: 30px;
  /* display: table-cell; */
  /* vertical-align: middle; */
}

.opimg {
  /* 	max-width: 100%;
max-height: 100%;
display: block;
margin: auto;   */
  display: flex;
  align-items: flex-end;
  width: 65px;
  height: 65px;
  /* background: url("/static/baoshan.png"); */
  /* background-position: 10px 0px; */
  background-size: auto 65px;
  background-repeat: no-repeat;
}

/* 	.img_name {
border: 1px solid red;
height: 18px;
width: 100%;
background-color: #fff;
text-align: center;
lighting-color: 18px;
} */

/* .img {
background-image: url('../../static/baoshan.png');
height: 50px;
} */

.rdoitem {
  /* margin: 0px auto; */
  line-height: 45px;
  /* border: 1px dashed greenyellow; */
  width: 45px;
  height: 45px;
  font-size: 16 rpx;
  text-align: center;
}
.rdoitem1{
  line-height: 45px;
  height: 45px;
  text-align: center;
  width: 100%;


}

.rdoitem_slider {
  width: 60%;
}
.rdoitem_slider_text{
  width: 30%;
  font-size: 12px;
}

.mode_choice {
  margin-right: 5px;
}

.mode_choice_item {
  display: flex;
}

.mode_choice_item_text {
  margin-right: 5px;
}
 .hbxw-slider-example{
    display: flex;
    flex-direction: column;
    padding: 30rpx;
  }
  .hbxw-slider-title{
    font-size: 32rpx;
    line-height: 64rpx;
    color: green;
  }
  .hbxw-slider-tag{
    width:100%;
    text-align: center;
    font-size: 24rpx;
    color: white;
  }
  .hbxw-slider-handle{
  }

</style>